{extends file="./main.tpl"}
{block name="head"}
<script src="./js/jquery.min.js">
</script>
<link href="css/user.css" rel="stylesheet" type="text/css" />

<script type="text/javascript">
function setContract()
{
	var dataString = "userId=" + $("#userId").val();
  $.ajax({
	  type: "GET",
	  url: "getDocumentData.php",
	  data: dataString,
	  success:function(data){
	    $("#contractId").html(data);  	
	  }
});
}
function setInvoce()
{
	var dataString = "userId=" + $("#userId").val() + "&contractId=" + $("#contractId").val();
  $.ajax({
    type: "GET",
    url: "getContractDetail.php",
    data: dataString,
    success:function(data){
      $(".setInvoiceNo").html(data); 
     }
});
}
 	 
function getNewInvoce()
{
	var invoice = $("#invoiceId").val();
	var dataString = "invoice=" + invoice;
  $.ajax({
    type: "GET",
    url: "getContractDetail.php",
    data: dataString,
    success:function(data){
      $(".setdata").html(data); 
     }
});
}

function getInvoiceDetail(conObj)
{
	var dataString = "invoiceNo=" + conObj.value;
  $.ajax({
    type: "GET",
    url: "getInvoiceDetail.php",
    data: dataString,
    success:function(data){
      $(".setInvoiceDetail").html(data); 
     }
});
}
</script>
{/block}
{block name="body"}
<form class="register1">
<table align="center" cellpadding="4" cellspacing="0">
<h1 align="center" style="font-size:px; color:#5BA7E9;">Contract Detail</h1>
<tr>
	<th><h2>User Name :</h2></th>
	<td><label>
		<select id="userId" onchange="setContract();" AUTOFOCUS >
			<option value="0">Select</option>
			  {html_options values=$userArray.userId output=$userArray.company}
	  </select></label>
	<th><h2>Contract No : </h2></th>
	<td><label>
		<select id="contractId" onchange="setInvoce();">
			<option value="0">&nbsp;&nbsp; Select &nbsp;&nbsp;&nbsp;</option>
	  </select></label>
  </td>
</tr>	
</table>
<div class="setInvoiceNo"></div>
<div class="setInvoiceDetail"></div>
{/block}
